/**
 * 角色管理模块的样式表
 * @author xiaoxujs
 */

import styled from "styled-components";
import leftJiantouTitle from '../../../assets/image/ConfigManagement/left_jiantou_title.png'
import rightJiantouTitle from '../../../assets/image/ConfigManagement/right_jiantou_title.png'

export const RolePageBox = styled.div`

`

export const RolePageHeaderBox = styled.div`
      height: 6rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 3rem;
    .left{
        display: flex;
        align-items: center;
        font-weight: 500;
        font-size: 1.8rem;
        color: #87B9DE;
        .left_left_jiantou{
            width: 14px;
            height: 20px;
            background: url(${leftJiantouTitle});
            background-size: 100% 100%;
            margin-right: 1rem;

        }
        .left_right_jiantou{
            width: 14px;
            height: 20px;
            background: url(${rightJiantouTitle});
            background-size: 100% 100%;
            margin-left: 1rem;

        }

    }
    .right{
        display: flex;
        align-items: center;
    }
`

export const RolePageListBox = styled.div`
    width: 174rem;
    margin: 0 auto;
    padding: 0 3rem;
    min-height: 20rem;
    background: rgba(5, 15, 30, .5);
    border-radius: .4rem;
    padding-bottom: 2rem;
    table{
        width: 100%;
        border-collapse: collapse;
        th{
            height: 5.5rem;
            line-height: 5.5rem;
            align-content: center;
            /* display: flex;
            align-items: center;
            justify-content: center; */
            div{
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 1.4rem;
                color: #92A9C4;
            }
        }
        td{
            .button{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .td_div_style{
                display: flex;
                align-items: center;
                justify-content: center;
                font-weight: normal;
                font-size: 1.4rem;
                color: #CEE2FA;
                height: 4.6rem;
            }
        }
        tbody{
            tr{
                height: 4.6rem;
            }
            tr:nth-child(odd){
            background-color: #101F34;
            }
        }
       
    }
`
export const Guangdian = styled.div`
    width: .7rem;
    height: .7rem;
    background: #00AEFF;
    border-radius: 50%;
    display: inline-block;
    margin-right: 1rem;
   
`